<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>回款计划</title>
    <link rel="stylesheet" type="text/css" href="./css/api.css" />
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <link rel="stylesheet" type="text/css" href="./css/styleold.css" />

    <script type="text/javascript" src="./script/api.js"></script>
    <script type="text/javascript" src="./script/aui-tab.js" ></script>
    <link rel="stylesheet" type="text/css" href="./css/aui-slide.css" />
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
    <script type="text/javascript">
        function closeWin(){
            api.closeWin({
            });
        };
    </script>
</head>
<body>
   <!-- 头部 -->
   <header class="aui-bar aui-bar-nav pos" id="topbar" id="topbar">
    <a class="aui-pull-left aui-btn" onclick="closeWin()">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title">回款计划</div>
<!--     <div class="aui-title">
        <i class="fa fa-chevron-circle-left plr05" onclick="lastMonth();"></i>
        <em id="year">2017</em>-
        <em id="month">09</em>
        <i class="fa fa-chevron-circle-right plr05" onclick="nextMonth();"></i>
    </div> -->
</header>
<div class="header-d"></div>
<div id="list">
    <div class="my-repay-plan">
        <h3>00-00</h3>
        <ul>
            <li>
                <div class="aui-col-xs-10 my-repay-plan-l">
                    <p>企业经营贷-000000-00000</p>
                    <p>本金:<span>0,000.00</span>利息:<span>0.00</span></p>
                </div>
                <div class="aui-col-xs-2 my-repay-plan-r">
                    已还
                </div>
            </li>
        </ul>
        <div class="my-repay-plan-btn-t"></div>
        <div class="my-repay-plan-btn">
            <div class="aui-col-xs-6"><p>月已回金额(元)</p>0,000.00</div>
            <div class="aui-col-xs-6"><p>月待回金额(元)</p>0,000.00</div>
        </div>
    </div>
</div>
</body>
<script type="text/template" id="template">
    <!-- 头部 -->
    <div class="my-repay-plan">
        {{~it.repay_list:value:index}}
        <h3>{{=value.pay_time}}</h3>
        <ul>
            <li>
                <div class="aui-col-xs-10 my-repay-plan-l">
                    <p>{{=value.name}}-{{=value.deal_sn}}</p>
                    {{? value.type <= 29}}
                    <p>利息:<span>{{=value.pay_money}}元</span></p>
                    {{?? value.type > 29}}
                    <p>本金:<span>{{=value.pay_money}}元</span></p>
                    {{?}}
                </div>
                {{? value.status == '0'}}
                <div class="aui-col-xs-2 my-repay-plan-r">
                    未还
                </div>
                {{??}}
                <div class="aui-col-xs-2 my-repay-plan-r">
                    已还
                </div>
                {{?}}
            </li>
        </ul>
        {{~}}
        <div class="my-repay-plan-btn-t"></div>
        <div class="my-repay-plan-btn">
            <div class="aui-col-xs-6"><p>已回金额(元)</p>{{=it.true_pay}}</div>
            <div class="aui-col-xs-6"><p>待回金额(元)</p>{{=it.wait_pay}}</div>
        </div>
    </div>
</script>
<script type="text/javascript">
    apiready = function(){

        var id = api.pageParam.id;
        updateData(id);

    };

    // 获取当前年月
    function getYearAndMonth(){
        //获取完整的日期
        var date=new Date;
        year=date.getFullYear();
        month=date.getMonth()+1;
        month = (month<10 ? "0"+month:month);
        var yearEle = $('#year');
        yearEle.text(year);
        var monthEle = $('#month');
        monthEle.text(month);
    }

    // 更新数据,模板函数
    // function updateData(date){
    //     tempDate = date;
    //     // 进度提示款
    //     api.showProgress({
    //         title: '努力加载中...',
    //         text: '先喝杯茶...',
    //         modal: false
    //     });

    //     var userid = $api.getStorage('userid');
    //     api.ajax({
    //         url: webAddress + '/member.php?ctl=app_user_center&act=repay_list',
    //         method: 'post',
    //         data: {
    //             values: {
    //                 user_id: userid,
    //                 month: date,
    //             },
    //         }
    //     },function(ret, err){
    //         if (ret) {
    //             // 关闭下拉刷新控件
    //             api.refreshHeaderLoadDone();
    //             api.hideProgress();
    //             if (ret.status == 0) {
    //                 alert(ret.info);
    //                 return false;
    //             }else{
    //                 var data = ret.repay_list;
    //                 data.wait_pay = outputmoney(ret.wait_pay);
    //                 data.true_pay = outputmoney(ret.true_pay);
    //                 if (data == '') {
    //                     var list = $api.byId('list');
    //                     list.innerHTML = '<div class="login-list-no">没有回款中的项目</div>';
    //                 }else{
    //                     // 列表右上角的状态 利息还是本金
    //                     for (var i = 0; i < data.length; i++) {
    //                         if (data[i].true_repay == '0.00') {
    //                           data[i].state = '待还';
    //                           data[i].money = outputmoney(data[i].wait_repay);
    //                       }else{
    //                         data[i].state = '已还';
    //                         data[i].money = outputmoney(data[i].true_repay);
    //                     }
    //                 }
    //                 templateFun(data);
    //             }
    //         }
    //     } else {
    //         alert(err.msg);
    //         api.refreshHeaderLoadDone();
    //         api.hideProgress();
    //     }
    // });
    // };

    // 模板赋值函数
    // function templateFun(data){
    //     var template = $api.byId('template');
    //     var dotFn = doT.template(template.innerHTML);
    //     var html = dotFn(data);
    //     var user = $api.byId('list');
    //     $api.html(user, html);
    // }


    // 更新数据,模板函数
    function updateData(id){

        // 进度提示款
        api.showProgress({
            title: '努力加载中...',
            text: '先喝杯茶...',
            modal: false
        });

        var userid = $api.getStorage('userid');
        api.ajax({
            url: webAddress + '/member.php?ctl=app_user_center&act=repay_list',
            method: 'post',
            data: {
                values: {
                    user_id: userid,
                    id: id,
                },
            }
        },function(ret, err){
            if (ret) {
                // alert(ret);
                // 关闭下拉刷新控件
                // api.refreshHeaderLoadDone();
                api.hideProgress();
                if (ret.status == 0) {
                    alert(ret.info);
                    return false;
                }else{
                    var data = ret;
                    templateFun(data);
                }
            } else {
                alert(err.msg);
                api.refreshHeaderLoadDone();
                api.hideProgress();
            }
        });
    };

    function templateFun(data){
        var template = $api.byId('template');
        var dotFn = doT.template(template.innerHTML);
        var html = dotFn(data);
        var user = $api.byId('list');
        $api.html(user, html);
    }

    // 下拉刷新
    function pullRefresh(){
        api.setRefreshHeaderInfo({
            // loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...'
        }, function(ret, err) {
            //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
            updateData(tempDate);
        });
    }

    // // 上拉加载
    // function pullLoading(){
    //     api.addEventListener({
    //         name: 'scrolltobottom',
    //         extra: {
    //             threshold: 0
    //         }
    //     }, function(ret, err){
    //        updateData();
    //    });
    // }

    // 上月按钮
    function lastMonth(){

        var yearEle = $('#year');
        var yearVal = yearEle.text();
        // 年份字符串转化为数字
        yearVal = parseInt(yearVal);

        var monthEle = $('#month');
        var monthVal = monthEle.text();
        var a = monthVal.substring(0,1);
        var b = monthVal.substring(1,2);
        a = parseInt(a);
        b = parseInt(b);

        if (a == 0) {
            if (b != 0) {
                if (b == 1) {
                    a = 1;
                    b = 2;
                    monthVal = ''+a+b;
                    month = monthVal;
                    monthEle.text(monthVal);
                    yearVal = yearVal - 1;
                    year = yearVal;
                    yearEle.text(yearVal);
                } else {
                    b = b - 1;
                    monthVal = ''+a+b;
                    month = monthVal;
                    monthEle.text(monthVal);
                }
            }
        } else {
            if (b == 0) {
                a = 0;
                b = 9;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
            } else {
                b = b - 1;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
            }
        }

        var date = year+'-'+month;
        updateData(date);
    }

    // 下月按钮
    function nextMonth(){

        var yearEle = $('#year');
        var yearVal = yearEle.text();
        // 年份字符串转化为数字
        yearVal = parseInt(yearVal);

        var monthEle = $('#month');
        var monthVal = monthEle.text();
        var a = monthVal.substring(0,1);
        var b = monthVal.substring(1,2);
        a = parseInt(a);
        b = parseInt(b);

        if (a == 0) {
            if (b == 9) {
                a = 1;
                b = 0;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
            } else {
                b = b + 1;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
            }
        } else {
            if (b == 2) {
                a = 0;
                b = 1;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
                yearVal = yearVal + 1;
                year = yearVal;
                yearEle.text(yearVal);
            } else {
                b = b + 1;
                monthVal = ''+a+b;
                month = monthVal;
                monthEle.text(monthVal);
            }
        }

        var date = year+'-'+month;
        updateData(date);
    }
</script>
</html>
